@charset "utf-8";
body{ margin:0px; padding:0px;position: relative;}
a{ text-decoration:none;}
ul{ list-style:none; margin:0px; padding:0px;}
p{ margin:0px;}
.width{ width:1200px; margin:0 auto;}
.both{ clear:both;}
a{ color:#000; transition:0.5s;}
#box{ width:100%; position:relative; overflow:hidden; height:500px;}
#box img{ transition:0.3s; position:absolute; top:0px; left:0px; height:100%; width:100%; object-fit:cover;}
.arrow{width:100%;}
.arrow a{ position:absolute; top:45%; background-color:rgba(255,255,255,0.8);border-radius:50%; color:#333; font-size:24px; padding:10px 15px; opacity:0;}
#box:hover .arrow a{ opacity:1;}

#top{ padding:30px 0;}
#top .left{ float:left;}
#top .left .p1{ color:#238143; font-size:28px; font-weight:600; font-family:'黑体';}
#top .left .p2{ color:#999; font-size:14px; margin-top:5px;}
#top .right{ background:url(../img/tel.png) left no-repeat; height:55px; float:right; padding-left:55px;}
#top .right .p1{ font-size:12px;}
#top .right .p2{ color:#238143; font-weight:600; font-size:28px;}

#nav{ background:#238143;position: sticky; top: 0; z-index: 9; transition: 1s;}
#nav a{ color:#fff; float:left; height:55px; line-height:55px;font-weight: 700; width:calc(100% / 6); text-align:center;}
#nav a:hover{ background:#23a143;}

#product{ padding:40px 0;}
#product .left{ float:left; width:calc(100% - 300px);}
#product .left .title{ background:url(../img/title.png); height:15px; line-height:15px; margin-bottom:40px;}
#product .left .title b{ font-size:28px; font-weight:600; color:#333; background:#fff;}
#product .left .title span{ color:#333; font-size:28px; padding:0 20px; background:#fff;}
#product .left .title a{ float:right; width:32px; font-size:24px; color:#fff; font-weight:600; height:32px; line-height:32px; text-align:center; background:#238143; margin-top:-8px;}
#product .left .product{ float:left; width:calc(100% / 3 - 16px); margin:8px;}
#product .left .product img{ width:calc(100% - 12px); height:200px; padding:5px; border:1px solid #ddd;}
#product .left .product p{ text-align:center; margin-top:10px; line-height:200%;}
#product .left .product p a{ color:#333;}
#product .right{ float:right; width:220px; background:#25b054; padding:25px;}
#product .right .title{ background:url(../img/product_type_title.jpg) left no-repeat #333; color:#fff; height:50px; line-height:50px; font-size:22px; padding-left:70px; background-size:50px; margin-bottom:20px;}
#product .right .product{ height:40px; line-height:40px;}
#product .right .product:before{ content:'>'; float:left; width:25px; text-align:center; height:40px; line-height:40px; color:#fff; font-family:'simsun';}
#product .right .product a{ color:#fff;}
#product .left .title a:hover{ transform:rotateZ(180deg); border-radius:50%; background:#23a143;}
#product .left .product:hover p a{ color:#238143;}
#product .right .product:hover a{ padding-left:10px;}

#index_show{ background:#238143;}
#index_show .left{ float:left; width:260px; height:260px; margin-right:40px;}
#index_show .left img{ height:100%; width:100%;}
#index_show .center{ float:left; padding:40px 0;}
#index_show .center .p1{ color:#ddd; font-size:24px;}
#index_show .center .p2{ margin:20px 0; padding:20px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; color:#fff; font-size:30px;}
#index_show .center .p3{ font-size:12px; color:#aaa;}
#index_show .right{ float:right; padding:85px 0;}
#index_show .right .p1{ background:url(../img/index_show_tel.png) left no-repeat; color:#fff; padding-left:40px; height:30px; line-height:30px;}
#index_show .right .p1 b{ font-size:24px; font-weight:100;}
#index_show .right .p2{ background:#e9e11a; height:40px; line-height:40px; font-size:14px; text-align:center; margin-top:20px;}

#youshi{ background:url(../img/youshi_bg.png); padding:40px 0;}
#youshi .title{ text-align:center; color:#333; font-weight:600; font-size:28px;}
#youshi .title b{ color:#238143;}
#youshi .title:after{ display:block; content:''; width:50px; height:2px; background:#ccc; margin:20px auto;}
#youshi .descript{ font-size:14px; color:#ccc; text-align:center; margin-bottom:40px;}
#youshi .product ,#youshi .product_phone{ float:left; width:calc(100% / 4); height:260px; background:#fff; text-align:center;}
#youshi .product_phone{ display:none;}
#youshi .product .icon , #youshi .product_phone .icon{ padding:40px 40px 20px; width:50px; height:50px;}
#youshi .product .p1 , #youshi .product_phone .p1{ font-family:'微软雅黑'; font-size:16px; width:90%; margin:0 auto; color:#333; line-height:200%;}
#youshi .product .p2 , #youshi .product_phone .p2{ margin-top:30px; color:#777; font-size:14px;}
#youshi .product .img , #youshi .product_phone .img{ width:100%; height:100%;}

#about{ padding:40px 0;}
#about .title{ text-align:center; color:#333; font-weight:600; font-size:28px;}
#about .title:after{ display:block; content:''; width:50px; height:2px; background:#ccc; margin:20px auto;}
#about .descript{ font-size:14px; color:#ccc; text-align:center; margin-bottom:40px;}
#about .left{ float:left; width:54%; margin-top:30px;}
#about .left .p1{ border-bottom:1px solid #eee; font-size:24px; color:#127a45; font-weight:600; padding-bottom:20px; margin-bottom:30px;}
#about .left .p1 b{ margin-left:10px; font-size:16px; color:#555; font-weight:100;}
#about .left .p2{ line-height:240%; width:90%;}
#about .left .p3{ margin-top:40px;}
#about .left .p3 a{ display:inline-block; width:180px; height:40px; line-height:40px; background:#127a45; color:#fff; text-align:center; border:1px solid #127a45;}
#about .right{ float:right; width:46%;}
#about .right img{ width:100%; height:370px; object-fit:cover;}
#about .left .p3 a:hover{ background:#fff; color:#238143;}


#news{ background:#e1ebeb; padding:40px 0;}
#news .left{ width:calc(100% - 380px); float:left;}
#news .left .title{ background:url(../img/title.png); height:15px; line-height:15px; margin-bottom:40px;}
#news .left .title b{ font-size:28px; font-weight:600; color:#333; background:#e1ebeb;}
#news .left .title span{ color:#333; font-size:28px; padding:0 20px; background:#e1ebeb; margin-left:-5px;}
#news .left .title a{ float:right; width:32px; font-size:24px; color:#fff; font-weight:600; height:32px; line-height:32px; text-align:center; background:#238143; margin-top:-8px;}
#news .left .product{ margin:12px 0;}
#news .left .product .new_time{ float:left; width:80px; height:80px; background:#25b054; text-align:center;}
#news .left .product .new_time .p1{ font-size:24px; line-height:200%; color:#fff;}
#news .left .product .new_time .p2{ color:#fff;}
#news .left .product .new_title{ float:right; width:calc(100% - 112px); padding:16px; background:#fff; transition:0.3s;}
#news .left .product .new_title .p1{ font-weight:600;}
#news .left .product .new_title .p1 a{ color:#333;}
#news .left .product .new_title .p2{ font-size:14px; color:#666; height:27px; line-height:28px; overflow:hidden;}
#news .right{ float:right; width:300px; padding:30px; background:#fff;}
#news .right .title{ background:url(../img/news_type_title.jpg) left no-repeat #333; color:#fff; height:50px; line-height:50px; font-size:22px; padding-left:70px; background-size:50px; margin-bottom:20px;}
#news .right .p1{ color:#238143; font-weight:600; font-size:14px; line-height:200%;}
#news .right .p2{ color:#333; font-size:14px; line-height:200%;}
#news .right img{ width:100%; height:140px; margin-top:2px;}
#news .left .title a:hover{ border-radius:50%; transform:rotateZ(180deg); background:#23a143;}
#news .left .product:hover .new_title{ padding-left:30px; width:calc(100% - 126px);}

#links{ background:#fff; padding:15px 0;}
#links p{ color:#238143; font-size:18px; font-weight:600;}
#links p a{ font-size:14px; color:#777; font-weight:600;}
#links p a:hover{ color:#238143;}
#foot{ width:100%; padding:30px 0px; background-color:rgb(35 129 67); color:#fff;}
#foot .left{ float:left; width:40%;}
#foot .center{ float:left; width:calc(30% - 3px - 10%); padding:0px 5%; border-left:1px solid #fff; border-right:1px solid #fff;}
#foot .right{ float:right; width:calc(30% - 5%); padding-left:5%;}
#foot p{ margin-bottom:15px; padding:10px 0px; background: url(../img/h.jpg) no-repeat left bottom;font-size: 20px;font-weight: 700;}
#foot .left span{ font-size:14px; line-height:200%;}
#foot .center li{ list-style:none; font-size:14px; padding:10px 0px; width:50%; float:left;}
#foot .center li a{ color:#fff; font-weight:700;}
#foot .center li a:hover{ color:#cda162;}
#foot .right img{ width:140px;}
#foot .right span{ display:block; text-align:center; width:140px; margin-top:5px;}

#foot_nav{ display:none;}

@media screen and (max-width: 980px) {
*{-webkit-text-size-adjust:none;}
#box{ height:300px;}
.width{ width:98%;}
#top .left .p2{ font-size:12px;}
#top .right .p2{ font-size:26px;}
#nav .width{ width:100%;}
#nav a{ width:calc(99% / 6);}
#product .left{ width:100%;}
#product .left .product{ width:calc(100% / 2 - 16px);}
#product .right{ display:none;}
#index_show .left{ display:none;}
#index_show .center{ padding:20px 0;}
#index_show .center .p1{ font-size:18px;}
#index_show .center .p2{ font-size:24px;}
#index_show .center .p3{ display:none;}
#index_show .right{ padding:40px 0;}
#index_show .right .p1{ font-size:12px;}
#index_show .right .p1 b{ font-size:18px;}
#index_show .right .p2{ font-size:12px;}
#youshi .product{ display:none;}
#youshi .product_phone{ width:calc(100% / 2); display:block;}
#about .left{ width:100%; margin:0;}
#about .left .p2{ width:100%;}
#about .right{ display:none;}
#news .left{ width:100%;}
#news .right{ width:calc(100% - 60px);}
#news .right img{ height:200px;}
#foot{ margin-bottom:20px;}
#foot p{ font-size:22px;}
#foot .left{ padding-left:5%;}
#foot .right{ padding-right:5%;}
#foot .left span{ font-size:18px;}
#foot .center li{ font-size:16px;}
#foot .center{ display:none;}
#foot_nav{ display:block; position:fixed; bottom:0px; width:100%; left:0px;}
#foot_nav li{ list-style:none;}
#foot_nav li a{ width:calc(100% / 4); text-align:center; height:40px; line-height:40px; background:#238143; color:#fff; float:left;}
}
